
<template>

  <div>
    <div>
      <el-link @click="zt()" plain><h1>基本信息</h1></el-link>
    </div>
    <el-row :gutter="10">
      <el-col :span="12">
        <el-card>
          <div style="width: 100%; height: 400px ;"id="line">
          </div>
          <div style="width: 100%; height: 400px ;"id="line1">
          </div>
          <div style="width: 100%; height: 400px ;"id="line2">
          </div>
        </el-card>
      </el-col>
    </el-row>
  </div>

</template>

<style scoped>

</style>
<script>
import * as echarts from 'echarts';

const option = {
  title: {
    text: '血压'
  },
  tooltip: {
    trigger: 'axis'
  },
  xAxis: {
    type: 'category',
    data: ['星期一','星期二','星期三','星期四','星期五','星期六','星期日']
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      data: [],
      type: 'line',
      smooth: true
    }
  ]
};


const option1 = {
  title: {
    text: '心率'
  },
  tooltip: {
    trigger: 'axis'
  },
  xAxis: {
    type: 'category',
    data: ['星期一','星期二','星期三','星期四','星期五','星期六','星期日']
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      data: [],
      type: 'line',
      smooth: true
    }
  ]
};

const option2 = {
  title: {
    text: '步数'
  },
  tooltip: {
    trigger: 'axis'
  },
  xAxis: {
    type: 'category',
    data: ['星期一','星期二','星期三','星期四','星期五','星期六','星期日']
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      data: [],
      type: 'line',
      smooth: true
    }
  ]
};








export default {

  data() {
    return {

    };
  },
  mounted() {

  // alert(this.$route.query.id)
    this.axios.get(`http://localhost:9010/fw/getInfo?id=${this.$route.query.id}`).then(res=>{
      let lineDom = document.getElementById('line');
      let lineChart = echarts.init(lineDom);
      option.series.data=[];

      for (let i=0;i<res.data.data.length;i++){
        /*option.xAxis.data.push(res.data.data[i].time);*/
        option.series[0].data.push(res.data.data[i].xymin);
      }
      lineChart.setOption(option);

      let lineDom1 = document.getElementById('line1');
      let lineChart1 = echarts.init(lineDom1);
      option1.series.data=[];
      for (let i=0;i<res.data.data.length;i++){
        /*option.xAxis.data.push(res.data.data[i].time);*/
        option1.series[0].data.push(res.data.data[i].xlmin);
      }
      lineChart1.setOption(option1);




      let lineDom2 = document.getElementById('line2');
      let lineChart2 = echarts.init(lineDom2);
      option2.series.data=[];
      for (let i=0;i<res.data.data.length;i++){
        /*option.xAxis.data.push(res.data.data[i].time);*/
        option2.series[0].data.push(res.data.data[i].bsmin);
      }
      lineChart2.setOption(option2);


      // let lineDom1 = document.getElementById('line1');
      // let lineChart1 = echarts.init(lineDom1);
      // option1.series.data=[];
      // for (let i=0;i<res.data.data.length;i++){
      //   /*option.xAxis.data.push(res.data.data[i].time);*/
      //   option1.series[0].data.push(res.data.data[i].xl);
      // }
      // console.log(option1)
      //
      // lineChart1.setOption(option1);

      /*let lineDom2 = document.getElementById('line2');
      let lineChart2 = echarts.init(lineDom2);
      option2.series.data=[];
      for (let i=0;i<res.data.data.length;i++){
        /!*option.xAxis.data.push(res.data.data[i].time);*!/
        option2.series[0].data.push(res.data.data[i].bs);
      }


      lineChart2.setOption(option2);*/

})



  },
  methods: {
    zt(){
      // $router.push({path:'/jkgl3',})
      this.$router.push({path:'/jkgl1',query:{id:this.$route.query.id}})
    },
  }
}
</script>
